import React, { useState, useEffect }  from 'react';
import { Row,Col, Modal, Button, Form, Input } from 'antd';
import { UploadOutlined } from '@ant-design/icons';
import  {executeSql}  from  '../api/dt'

export  default  function RunSql() {
    const [sql, setSql] = useState("");
    const { TextArea } = Input;
    const onFinish = (values) => {
        console.log('Success:', values);
        if(values.sqlStr=="") return;
        executeSql(values.sqlStr).then(
            (res) => {
            },
            (error) => {
                console.log("get response failed!");
            }
        )
    };

    const onFinishFailed = (errorInfo) => {
        console.log('Failed:', errorInfo);
    };
    return (
        <Form
            name="runSql"
            labelCol={{
                span: 4,
            }}
            wrapperCol={{
                span: 20,
            }}
            initialValues={{
                sqlStr: "",
            }}
            onFinish={onFinish}
            onFinishFailed={onFinishFailed}
            autoComplete="off"
        >
            <Form.Item
                label="执行内容："
                name="sqlStr"
                rules={[
                    {
                        required: true,
                        message: 'Please input your sql!',
                    },
                ]}
            >
                <TextArea rows={20}/>
            </Form.Item>



            <Form.Item
                wrapperCol={{
                    offset: 4,
                    span: 20,
                }}
            >
                <Button type="primary" htmlType="submit">
                    Submit
                </Button>
            </Form.Item>
        </Form>
    );
}
